<template>
  <div class="add">
    <!-- <h4></h4> -->
    <div class="add-head">
      <router-link to="/add/revenue">收入</router-link>
      <router-link to="/add/pay">支出</router-link>
    </div>
    <router-view></router-view>
  </div>
</template>

<script>
export default {
  
}
</script>


<style lang="less" scoped>
.add {
  width: 100%;
  height: 100%;
  background-color: #201f1f;
}
.add-head {
  display: flex;
  width: 45%;
  height: 1.8rem;
  color: #fff;
  line-height: 1.8rem;
  text-align: center;
  border: .1rem solid #ccc;
  border-radius: .2rem;
  margin: 0 auto;
  background-color: #000;

  a {
    display: block;
    flex: 1;
    color: #0099ff;
  }
}

a.router-link-exact-active {
  color: #000;
  box-shadow: 0 0 0.3rem #ddc1c1;
  background-color: #ccc;
  border: 1px solid #fff;
}
</style>